<template>
  <el-col class="header_bg">
    <el-col :span="mindata" class="max_logo">
      <strong>云匠荟</strong>
    </el-col>
    <el-col :span="1" class="minis" @click.native="shows">
      <i class="el-icon-s-fold"></i>
    </el-col>
    <el-col :span="maxdata" class="header_r">
      <el-col>
        <el-dropdown @command="handleCommand">
          <span class="el-dropdown-link">
            <img src="../assets/logo.jpg" alt />
            管理员
            <i class="el-icon-arrow-down el-icon--right"></i>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item @click="jurisdiction" command="jurisdiction">
              <i class="el-icon-s-flag"></i> 权限中心
            </el-dropdown-item>
            <el-dropdown-item command="editpass">
              <i class="el-icon-edit"></i> 修改密码
            </el-dropdown-item>
            <el-dropdown-item divided command="out">退出</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </el-col>
    </el-col>
    <el-dialog
      title="修改密码"
      :visible.sync="addclass"
      width="30%"
      @close="end"
      :modal-append-to-body="false"
    >
      <el-col class="class_put">
        <el-col :span="5">旧密码:</el-col>
        <el-col :span="18">
          <el-input v-model="addform.oldPass" type="password" size="small" placeholder="请输入旧密码"></el-input>
        </el-col>
      </el-col>
      <el-col class="class_put">
        <el-col :span="5">新密码:</el-col>
        <el-col :span="18">
          <el-input v-model="addform.newPass" size="small" type="password" placeholder="请输入新密码"></el-input>
        </el-col>
      </el-col>
      <el-col class="class_put">
        <el-col :span="5">确认密码:</el-col>
        <el-col :span="18">
          <el-input
            v-model="addform.com_Pass"
            size="small"
            placeholder="请再次确认密码"
            maxlength="11"
            type="password"
          ></el-input>
        </el-col>
      </el-col>
      <span slot="footer">
        <!-- <el-button @click=" = false">取 消</el-button> -->
        <el-button type="primary" @click="editsubimit" size="small">确定修改</el-button>
      </span>
    </el-dialog>
  </el-col>
</template>
<script>
export default {
  name: "headers",
  data() {
    return {
      isCollapse: false,
      addclass: false,
      editclass: false,
      mindata: 3,
      maxdata: 20,
      addform: {
        oldPass: "",
        newPass: "",
        com_Pass: ""
      }
    };
  },
  mounted() {},
  methods: {
    async handleCommand(command) {
      if (command === "out") {
        await this.$store.dispatch("outlogin", "");
        this.$router.push({
          path: "/"
        });
      }
      if (command === "jurisdiction") {
        this.jurisdiction();
      }
      if (command === "editpass") {
        this.using();
      }
    },
    shows() {
      this.isCollapse = !this.isCollapse;
      this.$store.commit("setisColl", this.isCollapse);

      if (this.isCollapse) {
        this.mindata = 1;
        this.maxdata = 22;
      } else {
        this.mindata = 3;
        this.maxdata = 20;
      }
    },
    jurisdiction() {
      //跳转权限
      this.$router.push({
        path: "/home/jurisdiction"
      });
    },
    async using() {
      this.$confirm("确定要修改密码吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.addclass = true;

          // this.editsubimit();
        })
        .catch(() => {});
    },
    async editsubimit() {
      if (
        this.addform.oldPass &&
        this.addform.newPass &&
        this.addform.com_Pass
      ) {
        let res = await this.$store.dispatch(
          "update_admin_password",
          this.addform
        );
        if (!res.code) {
          this.$confirm("修改密码成功请返回重新登录！", "提示", {
            confirmButtonText: "确定",
            showCancelButton: false,
            type: "warning"
          })
            .then(() => {
              this.$router.push({
                path: "/"
              });

              // this.editsubimit();
            })
            .catch(() => {});
          this.end();
        }
      } else {
        this.$message.error("请输入完整的内容");
      }
    },
    end() {
      this.addclass = false;
      this.addform.oldPass = "";
      this.addform.newPass = "";
      this.addform.com_Pass = "";
    }
  }
};
</script>
